<template>
  <div class="hello">
    <h1>{{ courseName }}</h1>
    <h1>{{ instructor }}</h1>
    <h1>{{ level }}</h1>
    <h1>{{ duration }}</h1>
    <h1>{{ enrolledStudents }}</h1>
    <h1>{{ num}}</h1>
    <slot></slot>
  </div>
</template>

<script>
// // vue3
// import { defineProps } from 'vue'

// defineProps({
//   data: {
//     type: Object,
//     default: () => ({
//       courseName: "Mathematics",
//       instructor: "张老师",
//       level: "Intermediate",
//       duration: 3,
//       enrolledStudents: 50
//     })
//   },
//   num:{
//     type:Number,
//     default:20
//   }
// })
// vue2
export default {
  name: "HelloWorld",
  components: {},
  props: ['data', 'num'],
  data() {
    const { courseName, instructor, level, duration, enrolledStudents } = this.data;
    return {
      courseName,
      instructor,
      level,
      duration,
      enrolledStudents
    };
  },
  methods: {
    getmsg(msg) {
      console.log(msg,111);
    },

  },
  mounted(){
    this.$emit('getMsg','数据')
  }
};
</script>